import React from "react";
import styles from "@pages/personal/styles/styles.module.less";
import { SlideRef } from "@shared/slide";
import { useUpdateProfileMutation } from "@service/user";
import Loading from "@shared/loading";
import toast from "react-hot-toast";
import { useEffect, useState } from "react";


interface Props {
    slideRef: React.RefObject<SlideRef | null>;
}

export default function UpdateGender({ slideRef }: Props) {
    // 用于修改用户性别
    const [updateProfile, { isLoading, isSuccess }] = useUpdateProfileMutation();
    // 监听用户性别是否修改成功
    useEffect(() => {
        // 修改成功
        if (isSuccess) {
            // 用户提示
            toast.success("用户性别修改成功");
            // 关闭弹框
            slideRef.current?.close();
        }
    }, [isSuccess, slideRef]);

    return (
        <ul className={styles.list}>
            <li onClick={() => updateProfile({ gender: 0 })}>男</li>
            <li onClick={() => updateProfile({ gender: 1 })}>女</li>
            <li onClick={() => slideRef.current?.close()}>取消</li>
            {isLoading && <Loading />}

        </ul>
    );
}
